<template>
  <div class="body">
    <div>
      <NavBar
        title="正高绩效"
        :icon="true"
        router="/"
      ></NavBar>
    </div>

    <div class="collapse">
      <!-- <div class="seleTime" @click="openTime"><span class="timeText">选择年份：</span>{{year}}<van-icon name="arrow-down" /></div> -->
      <van-popup
        v-model="show"
        position="bottom"
        :overlay="true"
      >
        <van-picker
          show-toolbar
          title="选择年份"
          :columns="columns"
          @cancel="onCancel"
          @confirm="onConfirm"
        />
      </van-popup>

      <div class="list">
        <van-collapse
          v-model="activeName"
          accordion
        >
          <div
            class="box"
            v-for="(item, index) in lookTeacher"
            :key="index"
          >
            <div class="ceBian">
              <div class="blue"></div>
              <div class="you">
                <van-collapse-item
                  :name="index"
                  value="详情"
                >
                  <div slot="title">
                    <div class="itemTitle">姓名：{{item.name}}</div>
                    <div class="buXi">所属系部：{{item.教师所属系部}}</div>
                    <div class="buXi">绩效项目共有 {{item.jiXiaoTitle.length}} 个</div>
                  </div>
                  <div
                    v-for="(o, l) in item.DataSort"
                    :key="l"
                  >
                    <div class="jiXiaoTitle">{{o.title}}</div>
                    <div
                      v-for="(e, i) in o.Data"
                      :key="i"
                    >
                      <div v-if="e.详情.length > 0">
                        <el-tooltip
                          placement="bottom"
                          class="xuanFu"
                        >
                          <div slot="content">
                            <li
                              v-for="(k, n) in e.详情"
                              :key="n"
                            >
                              {{k.title}}:
                              <div
                                v-for="(m,x) in k.data"
                                :key="x"
                              >{{m}}</div>
                            </li>
                          </div>
                          <li class="itemJiXiao liXiaHuaXian">{{e.标题}}({{e.cate}})</li>
                        </el-tooltip>
                      </div>
                      <li
                        class="itemJiXiao"
                        v-if="e.详情.length == 0"
                      >{{e.标题}}({{e.cate}})</li>
                    </div>
                    <div
                      v-if="o.Data.length == 0"
                      class="noWay"
                    >暂无数据</div>
                  </div>
                </van-collapse-item>
              </div>
            </div>
          </div>
        </van-collapse>
      </div>
    </div>

    <van-tabbar
      v-model="active"
      border
    >
      <div
        class="tabbar-item"
        @click="downExcel()"
      >
        <van-button type="info">导出Excel</van-button>
      </div>
      <van-tabbar-item
        icon="clock-o"
        @click="openTime"
      >选择时间</van-tabbar-item>
      <div class="tabbar-item">{{year}}年</div>
    </van-tabbar>
  </div>
</template>

<script>
import NavBar from "@/components/NavBar/navBar";
import linq from "linq";
import request from "../../utils/request";
export default {
  components: {
    NavBar
  },
  name: "Check",
  data() {
    return {
      active: 0,
      activeName: "0",
      teacher: [],
      lookTeacher: [],
      teacherNum: [],
      columns: ["2016", "2017", "2018", "2019"],
      show: false,
      year: "2019",
      cate: [
        "教学团队立项",
        "精品资源课程验收",
        "教改项目",
        "教学资源库验收",
        "纵向科研项目",
        "纵向横向到账经费",
        "横向技术及培训服务项目",
        "发明专利",
        "软件著作权",
        "技术转让",
        "发表论文",
        "可行性研究报告",
        "教程撰写",
        "学术著作",
        "科研奖励",
        "教学成功奖励",
        "教学荣誉称号",
        "教师技能比赛获奖",
        "指导学生技能竞赛获奖",
        "指导学生创新创业比赛获奖",
        "中层正职干部个人业绩",
        "正副党总支书记个人业绩",
        "正高教工个人业绩"
      ],
      教学工作业绩: [
        "教学团队立项",
        "精品资源课程验收",
        "教改项目",
        "教学资源库验收"
      ],
      教研科研业绩: [
        "纵向科研项目",
        "纵向横向到账经费",
        "横向技术及培训服务项目",
        "发明专利",
        "软件著作权",
        "技术转让",
        "发表论文",
        "可行性研究报告",
        "教程撰写",
        "学术著作"
      ],
      个人奖惩业绩: [
        "科研奖励",
        "教学成功奖励",
        "教学荣誉称号",
        "教师技能比赛获奖",
        "指导学生技能竞赛获奖",
        "指导学生创新创业比赛获奖"
      ],
      个人业绩: [
        "中层正职干部个人业绩",
        "正副党总支书记个人业绩",
        "正高教工个人业绩"
      ]
    };
  },
  created() {
    this.getTeacher();
    this.getYearDate();
    this.$toast.loading({
      duration: 0,
      mask: true,
      message: "加载中..."
    });
  },
  methods: {
    //年份获取
    getYearDate() {
      var now = new Date();
      now = now.getFullYear();
      var a = (now - 2).toString();
      var b = (now - 1).toString();
      var c = now.toString();
      this.columns = [a, b, c];
      this.year = c;
    },
    //获取正高正处教师
    async getTeacher() {
      var response = await request({
        method: "get",
        url: "teacher",
        params: {
          query: {
            role: "正高"
          }
        }
      });

      console.log(response);
      this.teacher = response.data;
      var teacherNum = response.data.map(item => {
        return item.number;
      });
      this.teacherNum = teacherNum;
      console.log(teacherNum);
      await this.getTeacherPerformance();
    },
    //获取教师绩效
    async getTeacherPerformance(teacher) {
      var response = await request({
        method: "get",
        url: "/performance",
        params: {
          query: {
            "参与教师.number": { $in: this.teacherNum },
            年份: this.year,
            status: "通过",
            cate: { $in: this.cate }
          },
          sort: { createTime: -1 }
        }
      });

      console.log(response);
      this.jiXiao = response.data;
      this.arrMake();
    },
    //排序整合
    arrMake() {
      this.teacher.forEach(item => {
        item.jiXiaoTitle = [];
        this.jiXiao.forEach(e => {
          e.参与教师.forEach((t, index) => {
            if (item.number == t.number && index < 4) {
              item.jiXiaoTitle.push(e);
            }
          });
        });
      });
      this.teacher.sort(function(a, b) {
        return b.jiXiaoTitle.length - a.jiXiaoTitle.length;
      });
      console.log(this.teacher);
      this.lookTeacher = this.teacher;
      this.getDataSort();
      this.$toast.clear();
    },
    //获取分类
    getDataSort() {
      // var data = this.teacher[0].jiXiaoTitle
      // console.log(data);
      this.teacher.forEach(item => {
        var data = item.jiXiaoTitle;
        var 教学工作业绩Data = [];
        var 教研科研业绩Data = [];
        var 个人奖惩业绩Data = [];
        var 个人业绩Data = [];

        data.forEach(el => {
          el.详情 = [];
          if (
            el.cate == "教学团队立项" ||
            el.cate == "精品资源课程验收" ||
            el.cate == "教改项目" ||
            el.cate == "教学资源库验收"
          ) {
            教学工作业绩Data.push(el);
          }
          if (
            el.cate == "纵向科研项目" ||
            el.cate == "纵向横向到账经费" ||
            el.cate == "横向技术及培训服务项目" ||
            el.cate == "发明专利" ||
            el.cate == "软件著作权" ||
            el.cate == "技术转让" ||
            el.cate == "发表论文" ||
            el.cate == "可行性研究报告" ||
            el.cate == "教程撰写" ||
            el.cate == "学术著作"
          ) {
            教研科研业绩Data.push(el);
          }
          if (
            el.cate == "科研奖励" ||
            el.cate == "教学成功奖励" ||
            el.cate == "教学荣誉称号" ||
            el.cate == "教师技能比赛获奖" ||
            el.cate == "指导学生技能竞赛获奖" ||
            el.cate == "指导学生创新创业比赛获奖"
          ) {
            个人奖惩业绩Data.push(el);
          }
          if (el.cate == "中层正职干部个人业绩") {
            el.详情 = [
              {
                title: "履行岗位职责情况",
                data: el.履行岗位职责情况.split("\n")
              },
              {
                title: "担当作为创新发展情况",
                data: el.担当作为创新发展情况.split("\n")
              }
            ];
            个人业绩Data.push(el);
          }
          if (el.cate == "正副党总支书记个人业绩") {
            el.详情 = [
              {
                title: "抓基层党建工作情况",
                data: el.抓基层党建工作情况.split("\n")
              },
              {
                title: "担当作为创新发展情况",
                data: el.担当作为创新发展情况.split("\n")
              },
              { title: "其他工作情况", data: el.其他工作情况.split("\n") }
            ];
            个人业绩Data.push(el);
          }
          if (el.cate == "正高教工个人业绩") {
            el.详情 = [
              { title: "行政管理情况", data: el.行政管理情况.split("\n") },
              { title: "廉洁自律情况", data: el.廉洁自律情况.split("\n") },
              { title: "其他工作情况", data: el.其他工作情况.split("\n") }
            ];
            个人业绩Data.push(el);
          }
        });
        item.DataSort = [
          { title: "个人业绩", Data: 个人业绩Data },
          { title: "教学工作业绩", Data: 教学工作业绩Data },
          { title: "教研科研业绩", Data: 教研科研业绩Data },
          { title: "个人奖惩业绩", Data: 个人奖惩业绩Data }
        ];
      });
      console.log(this.teacher);
    },
    onConfirm(value, index) {
      this.$toast.loading({
        duration: 0,
        mask: true,
        message: "加载中..."
      });
      this.year = value;
      this.show = false;
      this.getTeacherPerformance();
    },
    onCancel() {
      this.$toast("取消");
      this.show = false;
    },
    openTime() {
      this.show = true;
    },
    downExcel() {
      let sortArr = JSON.parse(JSON.stringify(this.teacher));
      let newArr = [];
      sortArr.forEach(i => {
        let item = {
          year: this.year,
          number: i.number,
          name: i.name,
          mou1: [],
          mou2: [],
          mou3: [],
          mou4: [],
          mou5: [],
          mou6: [],
          mou7: [],
          mou8: [],
          mou9: [],
          mou10: [],
          mou11: [],
          mou12: []
        };
        i.jiXiaoTitle.forEach(i2 => {
          if (i2.月份 == "1") {
            let m = `${i2.标题}(廉洁自律情况:${i2.廉洁自律情况},行政管理情况:${i2.行政管理情况},其他工作情况:${i2.其他工作情况})`;
            item.mou1.push(m);
          }
          if (i2.月份 == "2") {
            let m = `${i2.标题}(廉洁自律情况:${i2.廉洁自律情况},行政管理情况:${i2.行政管理情况},其他工作情况:${i2.其他工作情况})`;
            item.mou2.push(m);
          }
          if (i2.月份 == "3") {
            let m = `${i2.标题}(廉洁自律情况:${i2.廉洁自律情况},行政管理情况:${i2.行政管理情况},其他工作情况:${i2.其他工作情况})`;
            item.mou3.push(m);
          }
          if (i2.月份 == "4") {
            let m = `${i2.标题}(廉洁自律情况:${i2.廉洁自律情况},行政管理情况:${i2.行政管理情况},其他工作情况:${i2.其他工作情况})`;
            item.mou4.push(m);
          }
          if (i2.月份 == "5") {
            let m = `${i2.标题}(廉洁自律情况:${i2.廉洁自律情况},行政管理情况:${i2.行政管理情况},其他工作情况:${i2.其他工作情况})`;
            item.mou5.push(m);
          }
          if (i2.月份 == "6") {
            let m = `${i2.标题}(廉洁自律情况:${i2.廉洁自律情况},行政管理情况:${i2.行政管理情况},其他工作情况:${i2.其他工作情况})`;
            item.mou6.push(m);
          }
          if (i2.月份 == "7") {
            let m = `${i2.标题}(廉洁自律情况:${i2.廉洁自律情况},行政管理情况:${i2.行政管理情况},其他工作情况:${i2.其他工作情况})`;
            item.mou7.push(m);
          }
          if (i2.月份 == "8") {
            let m = `${i2.标题}(廉洁自律情况:${i2.廉洁自律情况},行政管理情况:${i2.行政管理情况},其他工作情况:${i2.其他工作情况})`;
            item.mou8.push(m);
          }
          if (i2.月份 == "9") {
            let m = `${i2.标题}(廉洁自律情况:${i2.廉洁自律情况},行政管理情况:${i2.行政管理情况},其他工作情况:${i2.其他工作情况})`;
            item.mou9.push(m);
          }
          if (i2.月份 == "10") {
            let m = `${i2.标题}(廉洁自律情况:${i2.廉洁自律情况},行政管理情况:${i2.行政管理情况},其他工作情况:${i2.其他工作情况})`;
            item.mou10.push(m);
          }
          if (i2.月份 == "11") {
            let m = `${i2.标题}(廉洁自律情况:${i2.廉洁自律情况},行政管理情况:${i2.行政管理情况},其他工作情况:${i2.其他工作情况})`;
            item.mou11.push(m);
          }
          if (i2.月份 == "12") {
            let m = `${i2.标题}(廉洁自律情况:${i2.廉洁自律情况},行政管理情况:${i2.行政管理情况},其他工作情况:${i2.其他工作情况})`;
            item.mou12.push(m);
          }
        });
        newArr.push(item);
      });
      console.log(newArr, "导出");

      import("@/vendor/Export2Excel").then(excel => {
        const tHeader = [
          "年份",
          "工号",
          "姓名",
          "一月份",
          "二月份",
          "三月份",
          "四月份",
          "五月份",
          "六月份",
          "七月份",
          "八月份",
          "九月份",
          "十月份",
          "十一月份",
          "十二月份"
        ];
        const filterVal = [
          "year",
          "number",
          "name",
          "mou1",
          "mou2",
          "mou3",
          "mou4",
          "mou5",
          "mou6",
          "mou7",
          "mou8",
          "mou9",
          "mou10",
          "mou11",
          "mou12"
        ];
        const list = newArr;
        const data = this.formatJson(filterVal, list);
        excel.export_json_to_excel({
          header: tHeader, //表头 必填
          data, //具体数据 必填
          filename: "excel-list", //非必填
          autoWidth: true, //非必填
          bookType: "xlsx" //非必填
        });
        this.$toast.success("导出成功");
      });
    },
    formatJson(filterVal, jsonData) {
      return jsonData.map(v =>
        filterVal.map(j => {
          if (j === "timestamp") {
            return parseTime(v[j]);
          } else {
            return v[j];
          }
        })
      );
    }
  }
};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
.body {
  overflow: hidden;
}
.collapse {
  margin-top: 55px;
  margin-bottom: 55px;
}
.box {
  margin-bottom: 0.6rem;
  margin-left: 15px;
}
.itemTitle {
  font-weight: bold;
  font-size: 0.9rem;
}
.seleTime {
  background-color: #eee;
  height: 2rem;
  line-height: 2rem;
  padding-left: 1rem;
}
.timeText {
  font-weight: bold;
}
.van-icon {
  margin-left: 0.2rem;
}
.buXi {
  font-size: 0.8rem;
  color: rgb(161, 159, 159);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 20em;
}
.jiXiaoTitle {
  font-size: 0.9rem;
  font-weight: bold;
  margin-top: 0.3rem;
  color: #7c7e83;
}
.itemJiXiao {
  color: rgb(161, 159, 159);
  padding-left: 0.3rem;
  margin-top: 0.8rem;
}
.noWay {
  padding-left: 0.3rem;
  color: #c43131;
}
.tabbar-item {
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  color: #7d7e80;
  font-size: 20px;
  line-height: 1;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.ceBian {
  display: flex;
}
.blue {
  background: rgb(85, 143, 250);
  width: 10px;
  border-top-left-radius: 5px;
  border-bottom-left-radius: 5px;
}
.you {
  width: 100%;
}
.xuanFu {
  margin: 4px;
  width: 80%;
}
.liXiaHuaXian {
  text-decoration: underline;
}
</style>
